<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../../layui/css/layui.css">
    <!--   引入核心js-->
    <script src="../../layui/layui.js"></script>
    <script>
        layui.use(['layer','jquery','table','form'],function (){
            let layer=layui.layer;//定义组件
            let $=layui.jquery;//定义组件
            let table = layui.table;//定义表格组件
            let form = layui.form;//定义表单组件
            table.render({
                elem: '#dg',
                url: '../../message/selectAll',
                //page: true,//开启分页
                parseData:function (res){
                    console.log(res)
                    return{
                        "code":0
                        ,"msg":""
                        ,"count":1000
                        ,"data":res
                    }
                },
                cols: [[ //表头
                    {type: 'checkbox'}
                    ,{field: 'messageid', title: '通知编号'}
                    ,{field: 'message', title: '通知内容'}
                ]]

            })
            $("#btn-add").click(function () {
                layer.open({
                    title:'添加通知',
                    type:1,
                    content:$("#add-dialog").html(),
                    area:['600px']
                })
                //监听添加提交表单
                form.on('submit(add-form-submit)',function (data) {
                    $.post('../../message/insertMess',data.field,function (flag) {
                        if(flag){
                            layer.msg('通知发布成功',{icon:6});
                            table.reload("dg");//刷新表格
                            layer.closeAll('page');//关闭当前对话框
                        }else{
                            layer.msg('通知发布失败',{icon:5});
                        }
                    })

                    return false;//阻止表单提交action属性的值

                })

            })
        })
    </script>
    <script id="add-dialog" type="text/html">
        <form  class="layui-form" id="add-form" name="add-form">
            <div class="layui-form-item">
                <input type="text" name="message" required  lay-verify="required"
                       placeholder="请输入通知内容" class="layui-input">
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn"  lay-submit lay-filter="add-form-submit">发布</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>
        </form>
    </script>
</head>
<body>
<button id="btn-add">发布通知</button>
<table id="dg"></table>
</body>
</html>